<template>
	<view class="ys">
		<view class="form">
			<uni-section title="店长" type="line">
				<view class="inputbox">
					<view class="item">
						{{store.name || ''}}
					</view>
				</view>
			</uni-section>
			<uni-section title="手机号" type="line" v-if="phone!=''">
				<view class="inputbox">
					<view class="item">
						{{phone}}
					</view>
				</view>
			</uni-section>
			<uni-section title="姓名" type="line">
				<view class="inputbox">
					<uni-easyinput v-model="name" trim placeholder="请输入姓名" clearSize="20"></uni-easyinput>
				</view>
			</uni-section>
			<uni-section title="身份" type="line">
				<view class="inputbox">
					<uni-data-checkbox v-model="role" :localdata="rolelist"></uni-data-checkbox>
				</view>
			</uni-section>
			<uni-section title="组别" type="line" v-if="role == 2">
				<view class="inputbox">
					<uni-data-select v-model="group_id" :localdata="groupRange"></uni-data-select>
				</view>
			</uni-section>
		</view>

		<button class="btn" @click="joinStore" :loading="loading" :disabled="loading">提交</button>
	</view>
</template>

<script>
	import {
		getStoreInfo,
		joinStore
	} from "@/api/user.js"
	import {
		commonParam
	} from "@/api/api.js"
	export default {
		data() {
			return {
				loading: false,
				name: '',
				phone: '',
				rolelist: [],
				role: '',
				group_id: '',
				groupRange: [],
				id: '',
				store_id: "",
				store: '',
				isLogin: false
			}
		},
		onLoad(e) {
			if (!e.scene) {
				return uni.$showMsg('参数异常')
			}
			let scene = decodeURIComponent(e.scene)
			let param = this.getUrlParams(scene)
			if (!param.store) {
				return uni.$showMsg('商家码参数异常')
			}
			this.store_id = param.store
			this.commonParam()
			this.getStoreInfo()
		},
		methods: {
			getStoreInfo() {
				getStoreInfo({
					store_id: this.store_id
				}).then(res => {
					if (res.code == 0) {
						this.isLogin = res.data.isLogin
						if (res.data.isLogin) {
							this.phone = res.data.phone
							this.store = res.data.store
							this.groupRange = res.data.group.map(item => {
								return {
									text: item.name,
									value: item.id
								}
							})
						} else {
							uni.$showMsg('请先登录')
						}
					} else {
						uni.$showMsg(res.msg)
					}
				})
			},
			commonParam() {
				commonParam().then(res => {
					if (res.code == 0) {
						this.rolelist = Object.values(res.data.staffRole).filter(item => item.allow_join)
						this.role = this.rolelist[0].value
					}
				})
			},
			joinStore() {
				let that = this
				if (!this.isLogin) {
					return uni.$showMsg('请先登录')
				}
				if (this.name == '') {
					return uni.$showMsg('请输入姓名')
				}
				if (this.group_id == '') {
					return uni.$showMsg('请选择组别')
				}
				that.loading = true
				joinStore({
					store_id: this.store_id,
					name: this.name,
					group_id: this.group_id,
				}).then(res => {
					uni.$showMsg(res.msg)
					if (res.code == 0) {
						setTimeout(() => {
							uni.switchTab({
								url: '/pages/user/auxiliary'
							})
						}, 1000)
					} else {
						that.loading = false
					}
				})
			}
		}
	}
</script>

<style lang="scss">
	.ys {
		.inputbox {
			width: 96%;
			margin: 0px auto;

			.item {
				padding: 10px;
				border: 1px solid #dcdfe6;
				border-radius: 4px;
			}
		}

		.form {
			padding-bottom: 15px;
			background: #fff;
		}



		.btn {
			button {
				color: #fff;
				font-size: 16px;
				letter-spacing: 1px;
				margin: 30px auto;
				width: 96%;
			}
		}
	}
</style>